<template>
  <div class="about-page">
    <h2>关于这个应用</h2>
    <p>这是一个用于演示 <strong>Vue Router + Pinia</strong> 技术栈的记事本项目，包含以下核心设计：</p>
    <ul>
      <li>📌 <strong>Vue Router</strong>：实现多页面路由管理（首页、记事本、关于）</li>
      <li>📌 <strong>Pinia</strong>：集中管理记事本的「任务数据 + 操作方法」，确保状态响应式</li>
      <li>📌 <strong>交互体验</strong>：支持回车添加、悬浮删除、二次确认清空等便捷操作</li>
      <li>📌 <strong>响应式</strong>：适配手机/平板/PC 多端屏幕</li>
    </ul>
    <p>技术栈版本：Vue 3 + Vue Router 4 + Pinia 2 + Vite</p>
  </div>
</template>

<script>
export default {
  name: 'AboutView'
}
</script>

<style scoped>
.about-page {
  max-width: 800px; /* 🔥 限制最大宽度（适配大屏，避免内容过宽） */
  margin: 0 auto;   /* 🔥 水平居中（左右自动留白） */
  padding: 20px;
}
h2 {
  color: #ff6b81;
  margin-bottom: 10px;
}
ul {
  list-style: disc;
  margin: 10px 0 10px 20px;
}
p {
  line-height: 1.6;
}
strong {
  color: #ff6b81;
}
</style>

